import ApiDocForm from '@/components/ApiDocForm'
import useTheme from '@/hooks/useTheme'
import Button from '@mui/material/Button'
import { createTheme, ThemeProvider } from '@mui/material/styles'
import React, { useRef, useState, useEffect } from 'react'
import './index.scss'

export default function PopupPage () {
  const { muiTheme, changeTheme } = useTheme()
  useEffect(() => {
    changeTheme('dark')
  }, [])
  const getAll = () => {
    chrome.runtime.sendMessage({ method: 'getAll' }, function (response) {
      console.log('收到来自后台的回复：' + response)
    })
  }

  return <ThemeProvider theme={muiTheme ?? createTheme({})}>
    <div style={{ width: 300, display: 'flex', flexDirection: 'column', padding: 10, background: '#fff' }}>
      <Button variant="contained" onClick={getAll} style={{ color: '#fff' }}>全项目爬取</Button>
      <ApiDocForm />
    </div>
  </ThemeProvider>
}

